import { NCollapseItem } from "naive-ui";
import type {
  CollapseItemArrowSlotProps,
  CollapseItemProps,
  CollapseItemHeaderSlotProps,
  CollapseItemHeaderExtraSlotProps,
} from "naive-ui";
import type { HTMLAttributes } from "vue";
import { getSlotsDom } from "../utils";
import type { BaseComponentType } from "../types";
export type CollapseItemFactoryConstructorType = {
  props?: CollapseItemProps;
  attrs?: HTMLAttributes;
  defaultSlot?: BaseComponentType;
  arrowSlot?: (v?: CollapseItemArrowSlotProps) => BaseComponentType;
  headerSlot?: (v?: CollapseItemHeaderSlotProps) => BaseComponentType;
  headerExtraSlot?: (v?: CollapseItemHeaderExtraSlotProps) => BaseComponentType;
};
export class CollapseItemFactory {
  private props: CollapseItemProps = {};
  private attrs: HTMLAttributes = {};
  private defaultSlot: BaseComponentType = null;
  private arrowSlot: (v?: CollapseItemArrowSlotProps) => BaseComponentType =
    () => null;
  private headerSlot: (v?: CollapseItemHeaderSlotProps) => BaseComponentType =
    () => null;
  private headerExtraSlot: (
    v?: CollapseItemHeaderExtraSlotProps
  ) => BaseComponentType = () => null;

  constructor(data?: CollapseItemFactoryConstructorType) {
    if (data?.props) this.setProps(data.props);
    if (data?.attrs) this.setAttrs(data.attrs);
    if (data?.defaultSlot) this.setDefault(data.defaultSlot);
    if (data?.arrowSlot) this.setArrow(data.arrowSlot);
    if (data?.headerSlot) this.setHeader(data.headerSlot);
    if (data?.headerExtraSlot) this.setHeaderExtra(data.headerExtraSlot);
  }

  setProps(props: CollapseItemProps) {
    this.props = props;
    return this;
  }

  setAttrs(attrs: HTMLAttributes) {
    this.attrs = attrs;
    return this;
  }

  setDefault(component: BaseComponentType) {
    this.defaultSlot = component;
    return this;
  }
  setArrow(component: (v?: CollapseItemArrowSlotProps) => BaseComponentType) {
    this.arrowSlot = component;
    return this;
  }
  setHeader(component: (v?: CollapseItemHeaderSlotProps) => BaseComponentType) {
    this.headerSlot = component;
    return this;
  }

  setHeaderExtra(
    component: (v?: CollapseItemHeaderExtraSlotProps) => BaseComponentType
  ) {
    this.headerExtraSlot = component;
    return this;
  }
  /**
   * Creates a naive-ui CollapseItem component
   * @returns An instance of the naive-ui CollapseItem component
   */
  create() {
    return (
      <NCollapseItem {...this.attrs} {...this.props}>
        {{
          default: () => getSlotsDom(this.defaultSlot),
          arrow: (props: CollapseItemArrowSlotProps) =>
            getSlotsDom(this.arrowSlot(props)),
          header: (props: CollapseItemHeaderSlotProps) =>
            getSlotsDom(this.headerSlot(props)),
          "header-extra": (props: CollapseItemHeaderExtraSlotProps) =>
            getSlotsDom(this.headerExtraSlot(props)),
        }}
      </NCollapseItem>
    );
  }
}
